<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>设备管理-frame</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/style.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui.2.0.css" />
    <style>
        [v-cloak] {
            display: none;
        }

        html{
          background-color: #f5f5f5;
        }

        .text-header {
            width: 95%;
            font-size: 30px;
            font-weight: bold;
            margin: 0 auto;
            margin: 30px 0;
            padding-left: 30px;
        }

        .text-body {
            width: 95%;
            margin: 0 auto;
            display: -webkit-flex;
            display: flex;
            justify-content: flex-start;
            align-items: center;
        }

        .text-body>div:nth-child(1) {
            width: 80%;
            padding-left: 30px;
        }

        .text-body>div:nth-child(2) {
            width: 20%;
            color: #24ca29;
        }

        .text-body>div>p:nth-child(1) {
            color: #000;
        }

        .text-body>div>p:nth-child(2) {
            font-size: 17px;
            color: #777;
        }
        .module-manage{
          width: 90%;
          margin: 0 auto;
          display: -webkit-flex;
          display: flex;
          justify-content: flex-start;
          height: 200px;
          margin-top: 30px;
        }
        .module-manage > div:nth-child(1){
          width: 50%;
          height: 200px;
        }
        .module-manage > div:nth-child(2){
          width: 50%;
          height: 200px;
        }
        .module-manage > div > p{
          height: 100px;
          width: 100%;
        }
        .module-manage > div > p{
          width: 100%;
          font-size: 25px;
          margin: 0 auto;
          height: 100px;
          line-height: 100px;
          text-align: center;
        }
        .module-manage > div > div{
          color: #fff;
          box-sizing: border-box;
        }
        .module-manage > div:nth-child(1){
          background-image: url('../image/500450909_wx.jpg');
          background-repeat: no-repeat;
          background-position: center center;
          background-size: cover;
        }
        .module-manage > div:nth-child(1) > div{
          width: 100%;
          height: 200px;
          background-image: linear-gradient(135deg, rgba(0,0,0,0.10) 0%, rgba(114,72,255,0.50) 100%);
        }
        .module-manage > div:nth-child(2) > p:nth-child(1){
          background-image: url('../image/500841057_wx.jpg');
          background-repeat: no-repeat;
          background-position: center center;
          background-size: cover;
        }
        .module-manage > div:nth-child(2) > p:nth-child(2){
          background-image: url('../image/500982518_wx.jpg');
          background-repeat: no-repeat;
          background-position: center center;
          background-size: cover;
        }
        .recording-wrapper > div{
          height: 100px;
          width: 100%;
        }

        .recording-wrapper > div > p{
          padding: 50px 0 0 100px;
          color: #fff;
        }

        .recording-wrapper > div:nth-child(1) > p{
          width: 100%;
          height: 100px;
          background-image: linear-gradient(135deg, rgba(0,0,0,0.10) 0%, rgba(114,72,255,0.50) 100%);
        }
        .recording-wrapper > div:nth-child(2) > p{
          width: 100%;
          height: 100px;
          background-image: linear-gradient(135deg, rgba(0,0,0,0.10) 0%, rgba(255,74,1,0.50) 100%);
        }
    </style>
</head>

<body>
    <main id="app">
        <div class="text-header">
            设备管理
        </div>
        <div class="text-body">
            <div>
                <p>本年度累计开舱：<span style="font-weight:bold">{{Query_DetailList.cabinTotal}}</span>次</p>
                <p>当日已治疗：{{Query_DetailList.treatmentTotal}}人<span style="padding-left:40px;">暂停治疗：{{Query_DetailList.stopTotal}}人</span></p>
            </div>
            <div>
                详细信息
            </div>
        </div>
        <div class="module-manage">
          <div onclick="enterEquipmentRecording()" style="text-align: center;">
            <div style="padding-top: 100px;padding-left: 70px;">
              <span>设备巡视记录</span><br>
              <span>系统运行记录</span>
            </div>
          </div>
          <div class="recording-wrapper">
            <div onclick="enterDisinfectionRecord()">
              <p>耐药菌消毒记录单</p>
            </div>
            <div onclick="enterTreatmentCabin()">
              <p>高压氧舱消毒记录单</p>
            </div>
          </div>
        </div>
    </main>
</body>

</html>

<script src="../script/api.js" charset="utf-8"></script>
<script src="../script/vue.js" charset="utf-8"></script>
<script src="../js/ToConfigure.js" charset="utf-8"></script>
<script type="text/javascript">
    var vm = null;
    apiready = function() {
        vm = new Vue({
            el: '#app',
            data: {
                Query_DetailList: {}, //舱室操舱人员信息
                getDateTime: '选择日期'
            },
            created() {
                //获取所属医院IP地址
                this.Url_IP = ToConfigure_IP("Gorgeous");

                //获取操作人员信息
                api.ajax({
                    url: this.Url_IP + 'HyperbaricOxygen/CabinTreatment/Query_DetailInfo',
                    method: 'get',
                    data: {
                        values: {}
                    }
                }, function(ret, err) {
                    if (ret) {
                        //舱室操舱人员信息
                        vm.Query_DetailList = ret[0];
                    } else {
                        var toast = new auiToast();
                        toast.fail({
                            title: "暂无信息",
                            duration: 2000
                        });
                    }
                });
            },
            watch: {
                searchInfo: function() {}
            },
            methods: {

            }
        })
    }

    // 进入设备巡视/系统运行记录页面
    function enterEquipmentRecording() {
      api.openWin({
          name: 'equipment-recording-header',
          url: './equipment-recording-header.html',
          pageParam: {
              name: 'equipment-recording-header'
          }
      });
    }

    function enterDisinfectionRecord() {
      api.openWin({
          name: 'disinfection-record-header',
          url: './disinfection-record-header.html',
          pageParam: {
              name: 'disinfection-record-header'
          }
      });
    }

    function enterTreatmentCabin() {
      api.openWin({
          name: 'treatment-cabin-header',
          url: './treatment-cabin-header.html',
          pageParam: {
              name: 'treatment-cabin-header'
          }
      });
    }
</script>
